<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>我的购物车</title>
<jsp:include page="header.jsp"></jsp:include>
</head>
<style>
	.my-cell-row {
		width: 100%;
		margin: 10px 10px;
	}
	 .weui-media-box_appmsg .weui-media-box__hd img{
	 	display:block;
		width: 100%;
		height: 100%;
	} 
	.wy-pro-pri a {
		display:block;
		float:right;
		width:50px;
		height: 24px;
		margin-top:-20px;
		font-size: .7rem;
		text-align:center;
		padding-top:3px;
		color: #000;
		border:#000 solid 1px;
		border-radius:5px;
	}
	.wy-pro-pri a.my-fl {
		display: block;
		float: left;
		margin-left: 100px;
	}
	.wy-pro-pri a.my-fr {
		display: block;
		float: right;
	}
	.weui-content {
		background-color: #fff;
	}
	
	.weui-tabbar__item:nth-child(2) {
		border-left: #eee solid 1px;
	}
	.weui-tabbar__item:nth-child(3) {
		border-left: #eee solid 1px;
	}
</style>
<body ontouchstart>
<!--主体-->
<div class="weui-content">
<c:choose>
	<c:when test="${not empty list}">
	<c:forEach var="app" items="${list}" varStatus="st">
  	<div class="weui-media-box__bd  pd-10">
            <div class="weui-media-box_appmsg ord-pro-list">
              <div class="weui-media-box__hd"><a href="javascript:;"><img class="weui-media-box__thumb" src="${pageContext.request.contextPath }${app.goodsPic}" alt=""></a></div>
              <div class="weui-media-box__bd">
                <h1 class="weui-media-box__desc"><a href="${pageContext.request.contextPath }/phone/detail?id=${app.goodsId}" class="ord-pro-link">${app.goodsName}</a></h1>
                <div class="clear mg-t-10">
                  <div class="wy-pro-pri fl">¥<em class="num font-15">${app.goodsPrice}</em></div>
                  <div class="pro-amount fr"><span class="font-13">数量×<em class="name">${app.goodsNumber}</em></span></div>
                </div>
              </div>
            </div>
          </div>
           <div class="weui-panel__hd">
            <span class="wy-pro-pri"><a href="javascript:;" class="my-fl" onclick="myPay(${app.id})">支付</a></span>
            <span class="wy-pro-pri"><a href="javascript:;" class="my-fr" onclick="myDel(${app.id})">删除</a></span>
          </div>
    </c:forEach>
  </c:when>
  <c:otherwise>
		<div class="my-cell-row">
			<span>您还没有购买药品!</span>
		</div>
		</c:otherwise>
	</c:choose>

</div>
<div class="foot-black"></div>
<div class="weui-tabbar wy-foot-menu">
  <a href="/phone/shop" class="weui-tabbar__item">
    <div class="weui-tabbar__icon foot-menu-home"></div>
    <p class="weui-tabbar__label">首页</p>
  </a>
  <a href="/phone/cart" class="weui-tabbar__item weui-bar__item--on">
    <!-- <span class="weui-badge" style="position: absolute;top: -.4em;right: 1em;">8</span> -->
    <div class="weui-tabbar__icon foot-menu-cart"></div>
    <p class="weui-tabbar__label">购物车</p>
  </a>
  <a href="/phone/userInfo" class="weui-tabbar__item">
    <div class="weui-tabbar__icon foot-menu-member"></div>
    <p class="weui-tabbar__label">我的</p>
  </a>
</div>
<jsp:include page="foot.jsp"></jsp:include>
<script>
function myDel(id){
	$.confirm("确定从购物车里面删除吗?", function() {
		var url="/phone/delCart?id="+id;
		$.get(url,function(data){
			if("ok"==data){
				$.toast("删除购物车成功!","text");
				window.location.reload();
			}
			})
		  }, function() {
		  $.toast("您取消了操作!","text");
		  });
	}
	function myPay(id){
		var url ="/phone/cartOneOrder?id="+id;
		$.get(url,function(data){
			if("error"!=data){
				var url ="/phone/toOrder?id="+data;
				window.location.href=url;
			}
		}); 
	}

</script>
</body>
</html>